<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="/baseproject/js/jquery-1.6.2.js"></script>
<script type="text/javascript" src="/baseproject/js/baseui/ui/jquery-ui.js"></script>
<script type="text/javascript" src="/baseproject/js/plugin/table/flexigrid.js"></script>
<link href="/baseproject/css/basethemes/themes/base/jquery-ui.css"
	rel="stylesheet" type="text/css" />
<link href="/baseproject/css/plugin/table/flexigrid.css"
	rel="stylesheet" type="text/css" />
<script>

	$(document).ready(function(){
	
			
		
		$('#yourTableID').flexigrid({
			minheight:'100',
			usepager : true,
			outof : 20,
			searchitems : [ {
				display : '名称',
				name : 'iso'
			}, {
				display : '公司',
				name : 'name',
				isdefault : true
			} ],
			sortname : "iso",
			sortorder : "asc",
			usepager : true,
			title : '列表信息展现',
			useRp : true,
			rp : 15,
			showTableToggleBtn : true,
			striped:false
			
			});
			
		$('#yourTableID2').flexigrid({
			idListAll : 'idCheckListAll',
			height:'auto',
			usepager : true,
			outof : 20,
			searchitems : [ {
				display : '名称',
				name : 'iso'
			}, {
				display : '公司',
				name : 'name',
				isdefault : true
			} ],
			sortname : "iso",
			sortorder : "asc",
			usepager : true,
			title : '列表信息展现',
			useRp : true,
			rp : 15,
			showTableToggleBtn : true,
			striped:false
			});
			setTimeout(function(){
					document.getElementById('idCheckListAll').click=function(){
					alert("ffukyououoauflasjdf");
				}
			},100
			);
	});
	
	
	
</script>
</head>

<body>
<style>
.table_title{
	font-weight:bold;
	font-family:仿宋体, Arial, Helvetica, sans-serif;
}
</style>

<table id="yourTableID" width="800" border="0" cellspacing="0" cellpadding="0">
<thead>
	<tr>
		<th width="100"  class="table_title">Check out this header</th>
		<th width="400" >Look here's another one</th>
		<th width="300" >Wow, look at me!</th>
	</tr>
</thead>
<tbody>	
	<tr>
		<td>Some content goes in here</td>
		<td>Praesent vitae ligula nec orci pretium vestibulum</td>
		<td>Maecenas tempus dictum libero</td>
	</tr>
	<tr>
		<td>Quisque in wisi quis orci tincidunt fermentum</td>
		<td>Mauris aliquet mattis metus</td>
		<td>Etiam eu ante non leo egestas nonummy</td>
	</tr>
	<tr>
		<td>Some content goes in here</td>
		<td>Praesent vitae ligula nec orci pretium vestibulum</td>
		<td>Maecenas tempus dictum libero</td>
	</tr>
	<tr>
		<td>Quisque in wisi quis orci tincidunt fermentum</td>
		<td>Mauris aliquet mattis metus</td>
		<td>Etiam eu ante non leo egestas nonummy</td>
	</tr>
	<tr>
		<td>Some content goes in here</td>
		<td>Praesent vitae ligula nec orci pretium vestibulum</td>
		<td>Maecenas tempus dictum libero</td>
	</tr>
	<tr>
		<td>Quisque in wisi quis orci tincidunt fermentum</td>
		<td>Mauris aliquet mattis metus</td>
		<td>Etiam eu ante non leo egestas nonummy</td>
	</tr>
	<tr>
		<td>Some content goes in here</td>
		<td>Praesent vitae ligula nec orci pretium vestibulum</td>
		<td>Maecenas tempus dictum libero</td>
	</tr>
	<tr>
		<td>Quisque in wisi quis orci tincidunt fermentum</td>
		<td>Mauris aliquet mattis metus</td>
		<td>Etiam eu ante non leo egestas nonummy</td>
	</tr>
	<tr>
		<td>Some content goes in here</td>
		<td>Praesent vitae ligula nec orci pretium vestibulum</td>
		<td>Maecenas tempus dictum libero</td>
	</tr>
	<tr>
		<td>Quisque in wisi quis orci tincidunt fermentum</td>
		<td>Mauris aliquet mattis metus</td>
		<td>Etiam eu ante non leo egestas nonummy</td>
	</tr>
	<tr>
		<td>Some content goes in here</td>
		<td>Praesent vitae ligula nec orci pretium vestibulum</td>
		<td>Maecenas tempus dictum libero</td>
	</tr>
	<tr>
		<td>Quisque in wisi quis orci tincidunt fermentum</td>
		<td>Mauris aliquet mattis metus</td>
		<td>Etiam eu ante non leo egestas nonummy</td>
	</tr>
	<tr>
		<td>Some content goes in here</td>
		<td>Praesent vitae ligula nec orci pretium vestibulum</td>
		<td>Maecenas tempus dictum libero</td>
	</tr>
	<tr>
		<td>Quisque in wisi quis orci tincidunt fermentum</td>
		<td>Mauris aliquet mattis metus</td>
		<td>Etiam eu ante non leo egestas nonummy</td>
	</tr>
	<tr>
		<td>Some content goes in here</td>
		<td>Praesent vitae ligula nec orci pretium vestibulum</td>
		<td>Maecenas tempus dictum libero</td>
	</tr>
	<tr>
		<td>Quisque in wisi quis orci tincidunt fermentum</td>
		<td>Mauris aliquet mattis metus</td>
		<td>Etiam eu ante non leo egestas nonummy</td>
	</tr>
	<tr>
		<td>Some content goes in here</td>
		<td>Praesent vitae ligula nec orci pretium vestibulum</td>
		<td>Maecenas tempus dictum libero</td>
	</tr>
	<tr>
		<td>Quisque in wisi quis orci tincidunt fermentum</td>
		<td>Mauris aliquet mattis metus</td>
		<td>Etiam eu ante non leo egestas nonummy</td>
	</tr>
</tbody>	
</table>
<hr></hr>

<table id="yourTableID2" width="1100" border="0" cellspacing="0" cellpadding="0">
<thead>
	<tr>
		<th width="30"><label><input type="checkbox" name="idCheckListAll" id="idCheckListAll" readOnly="readOnly" ></input></label>序号</th>
		<th width="400" class="table_title"><center>公司名称</center></th>
		<th width="400" class="table_title">公司地址</th>
		<th width="300" class="table_title">联系人电话</th>
	</tr>
</thead>

<tbody>	
	<tr>
		<td><input type="checkbox" name="test" ></td>
		<td align="left">为了放假拉王府井啊是的发</td>
		<td>违法急哦我减肥哦啊无法娇娃发酵法来我家</td>
		<td>124124</td>
	</tr>
	<tr>
		<td><input type="checkbox" name="test" ></td>
		<td align="left">为了放假拉王府井啊是的发</td>
		<td>违法急哦我减肥哦啊无法娇娃发酵法来我家</td>
		<td>124124</td>
	</tr>
	
	<tr>
		<td><input type="checkbox" name="test"  readOnly="readOnly"></td>
		<td align="left">为了放假拉王府井啊是的发</td>
		<td>违法急哦我减肥哦啊无法娇娃发酵法来我家</td>
		<td>124124</td>
	</tr>
	
</tbody>	
</table>
<hr></hr>
<div class="code">
		<pre>
$("#flex1").flexigrid({
	url: 'post2.php',
	dataType: 'json',
	colModel : [
		{display: 'ISO', name : 'iso', width : 40, sortable : true, align: 'center'},
		{display: 'Name', name : 'name', width : 180, sortable : true, align: 'left'},
		{display: 'Printable Name', name : 'printable_name', width : 120, sortable : true, align: 'left'},
		{display: 'ISO3', name : 'iso3', width : 130, sortable : true, align: 'left', hide: true},
		{display: 'Number Code', name : 'numcode', width : 80, sortable : true, align: 'right'}
		],
	buttons : [
		{name: 'Add', bclass: 'add', onpress : test},
		{name: 'Delete', bclass: 'delete', onpress : test},
		{separator: true}
		],
	searchitems : [
		{display: 'ISO', name : 'iso'},
		{display: 'Name', name : 'name', isdefault: true}
		],
	sortname: "iso",
	sortorder: "asc",
	usepager: true,
	title: 'Countries',
	useRp: true,
	rp: 15,
	showTableToggleBtn: true,
	width: 700,
	height: 200
});   
</pre>



</body>
</html>
